//@angular/core是一个npm的模块，定义了angular的核心功能
import { Component } from '@angular/core';

//弹出消息组建
import { AlertController } from 'ionic-angular';

//NavController就是用来管理和导航页面的一个controlle
import { NavController } from 'ionic-angular';

import { ViewController } from 'ionic-angular';
import { TabsPage } from '../tabs/tabs';

@Component({
    selector: 'page-web',
    templateUrl: 'login.html'
  })
//export关键词：将类暴露出去，以便其它的文件可以import到它。
//类的命名：在ionic3中，页面类采用页面名+Page的命名方式，首字母大写，如HomePage, ContactPage等。
export class LoginPage {

    user:any={username:'',password:''}

    //记住我
    remember = true;

    constructor(
        private alertCtrl:AlertController,
        public navCtrl: NavController,
        public viewCtrl:ViewController){

    }

    //登录处理
    login(){
        var username = this.user["username"];
        var password = this.user["password"] ;
        if(this.isEmpty( username )){
            this.showInfo("用户名不能为空");
            return ;
        }else if(this.isEmpty(password)){
            this.showInfo("密码不能为空");
            return ;
        }

        //登录验证
        if(username = "yellowcong" && password == "yellowcong"){
            this.showInfo("登录成功");

            //设定信息到window中，类始于浏览器的session中了
            window.localStorage.setItem("username",username);
            
            //关闭这个界面
            this.viewCtrl.dismiss();

            //到首页了
            this.navCtrl.setRoot(TabsPage);
        }else{
            this.showInfo("用户名密码错误");
        }
    }
    //提示消息
    showInfo(msg){
        let alter =  this.alertCtrl.create({
            title:'提示信息', 
            subTitle:msg, 
            buttons:['确定']}
        );
        //显示对话框
        alter.present();
    }
    /**
     * 判断数据是否为空
     * obj 需要判断的数据
     */
    isEmpty(obj:string){
        if(obj == null || obj ==undefined || obj == ''){
            return true ;
        }
        return false;
    }
    //进入界面资源还没有加载完成的情况
    ionViewDidLoad() {
        console.log('ionViewDidLoad FriendsPage');

        // document.getElementById();
        var tabs = document.getElementsByClassName('tabbar').item(0);
        tabs['style'].display = 'none';
     }

     //离开页面的时候，设置显示下面的tabbar
     ionViewWillLeave(){
        var tabs = document.getElementsByClassName('tabbar').item(0);
        tabs['style'].display = 'flex';
     }
}